<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>自驾沿途</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="css/all_css.css" />
		<link rel="stylesheet" type="text/css" href="css/weui/base.css" />
		<link rel="stylesheet" type="text/css" href="lib/weui.css" />
		<link rel="stylesheet" type="text/css" href="css/weui/jquery-weui.css" />
		<link rel="stylesheet" type="text/css" href="iconfont/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="css/loading_icon.css"/>
		<style type="text/css">
			body {
				background-color: #F5F5F5;
			}
			
			.cxgh_main {
				max-width: 640px;
				min-width: 320px;
				margin: 0px auto;
				padding-bottom: 50px;
			}
			
			.cxgh_head {
				height: 70px;
				background-color: #3385FF;
				padding: 25px 20px;
				max-width: 640px;
				min-width: 320px;
				width: 100%;
				margin: 0px auto;
				position: fixed;
				top: 0px;
				/*层级低于所有页面遮罩层*/
				z-index: 5;
			}
			
			.app_head_left {
				float: left;
				width: 30%;
				padding-top: 5px;
			}
			
			.app_head_left a {
				color: #FFFFFF;
				font-size: 1.5em;
				font-weight: bold;
				padding: 6px;
			}
			
			.app_head_mid {
				float: left;
				width: 40%;
				padding-top: 5px;
			}
			
			.app_head_right {
				float: right;
				width: 30%;
				height: 100%;
				margin-right: -5px;
				text-align: right;
			}
			
			.app_head_right a {
				position: relative;
				top: -2px;
				color: #FFFFFF;
				font-size: 2.3em;
			}
			
			#app_head_title {
				text-align: center;
				color: #FFFFFF;
				font-size: 1.6em;
				font-family: "宋体";
				font-weight: bold;
			}
			/*----起始地点设置区域样式----*/
			
			.placeInput {
				height: 100px;
				width: 100%;
				background-color: #FFFFFF;
				margin-top: 75px;
				z-index: 0;
			}
			
			.weui_tab_bd {
				background-color: #F5F5F5;
			}
			
			.placeInput_left,
			.placeInput_mid,
			.placeInput_right {
				float: left;
				height: 100%;
			}
			
			.placeInput_left {
				width: 15%;
				height: 100px;
				line-height: 112px;
				text-align: center;
			}
			
			.placeInput_left img {
				width: 50%;
				height: 30px;
			}
			
			.placeInput_mid {
				width: 70%;
			}
			
			.placeInput_mid img {
				width: 8%;
				float: left;
				display: block;
				margin-top: 15px;
			}
			
			.placeInput_mid input {
				width: 68%;
				height: 100%;
				border: none;
				outline: none;
				padding-left: 0.5em;
				/*color: #0070B4;*/
			}
			
			.placeInput_right {
				width: 15%;
				text-align: center;
				padding: 25px 0;
			}
			
			#research_btn {
				font-size: 2.0em;
				color: #0070B4;
			}
			
			.startPlace,
			.endPlace {
				width: 100%;
				height: 50%;
				float: left;
			}
			
			.startPlace {
				border-bottom: 1px solid #DEDEDE;
			}
			/*--收藏按钮--*/
			
			#collectionBtn {
				float: right;
				width: 25%;
				height: 100%;
				position: relative;
				left: 15px;
				top: -43px;
				text-align: center;
				/*border: 1px solid;*/
			}
			
			#taoxin {
				font-size: 1.7em;
				vertical-align: middle;
				color: #999999;
			}
			/*----底部----*/
			
			footer li a {
				color: #999999;
				margin-top: 7px;
			}
			
			footer li a div img {
				width: 32px;
				height: 26px;
			}
			
			footer li a p {
				font-size: 0.9em;
				position: relative;
				top: -3px;
			}
			
			#returnIndexLable {
				position: relative;
				top: -7px;
			}
			
			#returnIndexPic {
				position: relative;
				top: 3px;
			}
			
			.sel_body_name {
				height: 100% !important;
			}
			
			.myPlaceSign {
				position: absolute;
				color: #0070B4;
				font-size: 1.7em;
				margin-top: 7px;
			}
			
			table+div {
				/*border: 1px solid;*/
				display: none;
			}
			
			table tr td div div p:first-child {
				color: #0070B4 !important;
				font-weight: bold;
			}
			/* 将详情设置和出行规划方案选项框设置为固定定位 */
			
			.jumpRed {
				display: block;
				color: #000000;
				font-weight: bold;
				z-index: 9;
			}
			
			.downIcon {
				width: 16px;
				vertical-align: middle;
				margin-top: -5px;
			}
			
			.close-select {
				color: #0070B4 !important;
			}
			/*---遮罩层---*/
			
			.opacity {
				opacity: 0.7;
				filter: alpha(opacity=30);
				background-color: #000;
			}
			
			.mask {
				position: fixed;
				top: 0;
				height: 100%;
				width: 100%;
				/*层级应大于底部选项卡*/
				z-index: 15;
			}
			/*html,
			body {
				height: 100%;
			}*/
			
			.loadingImgResult {
				width: 100%;
				margin-top: 120px;
				text-align: center;
			}
			
			.loadingImgResult img {
				width: 100%;
			}
			/* select样式  */
			
			.weui_check_label {
				height: 4.5em;
			}
			
			.toolbar {
				height: 55px;
				background-color: #3385FF;
			}
			
			.title {
				margin-top: 4px;
				color: #FFFFFF !important;
				letter-spacing: 0;
				text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666;
			}
			
			.close-select {
				color: #FFFFFF !important;
				font-weight: bold;
				margin-top: 4px;
				margin-right: 5px;
			}
			/* 到百度地图查看隐藏 */
			
			.navtrans-view a {
				display: none;
			}
			/* 顶部返回按钮样式 */
			
			#returnCxgh {
				font-size: 1.16em;
				font-weight: bold;
				position: relative;
				top: 11px;
				left: -4px;
			}
			
			#noResultCar {
				text-align: center;
				color: #666666;
				width: 50%;
				margin-left: 25%;
				margin-right: 25%;
				font-size: 1.2em;
				font-weight: bold;
				margin-top: 90px;
			}
			/*map*/
			
			#l-map {
				width: 100%;
				margin-top: 70px;
			}
			/*去除百度图标*/
			
			.anchorBL {
				display: none;
			}
			/* 地图详情设置区域 底部 */
			
			#map_setUp {
				position: fixed;
				bottom: 0;
				width: 100%;
				max-width: 640px;
				min-width: 320px;
				margin: 0px auto;
				background-color: #FFFFFF;
				height: 50px;
				z-index: 10;
				line-height: 28px;
				text-align: center;
			}
			/*底部到地图查看*/
			
			#toMapBt {
				width: 100% !important;
				opacity: 0.8;
			}
			/*图层的两个底部选项*/
			
			.tc_Btn {
				width: 50%;
				float: left;
			}
			
			#map_setUp a {
				display: block;
				height: 100%;
				text-align: center;
				line-height: 50px;
			}
			
			#map_setUp a b {
				font-size: 1.15em;
				color: #3385FF;
			}
			
			#map_setUp a img {
				width: 20px;
			}
			
			#typeCar {
				border-right: 1px solid #999999;
			}
			
			.weui_tab {
				margin-top: 70px;
			}
			/*我的位置贴图*/
			
			#myPosition_div {
				width: 40%;
				position: absolute;
				margin-left: 11.5%;
				/*border: 1px solid;*/
				height: 48px;
				line-height: 52px;
				font-size: 1.2em;
				font-family: "黑体";
				color: #0070B4;
				background-color: #FFFFFF;
				z-index: 4;
			}
			
			.souzhoubian {
				color: #FFFFFF;
				display: block;
				width: 57px;
				height: 28px;
				background-color: #3385FF;
				line-height: 28px;
				position: fixed;
				right: 10px;
				bottom: 75px;
				border-radius: 4px;
				font-size: 0.95em;
			}
			
			.souzhoubian img {
				width: 34%;
				vertical-align: middle;
				position: relative;
				left: 3px;
			}
			
			.souzhoubian:active {
				color: #000000;
			}
			/*图层loading*/
			
			#tcLoading {
				position: absolute;
				top: 40%;
				left: 32%;
				width: 35%;
				height: 15%;
				font-size: 0.9em;
				background-image: url(img/index/yjzPic.gif);
				background-repeat: no-repeat;
				background-size: 100% 100%;
				text-align: right;
				z-index: 16;
				color: #FFFFFF;
			}
			/*#cxgh_all{
				border: 1px solid #3385FF;
			}*/
			
			#car {
				margin-top: 10px;
			}
			
			#myResult_car,
			#myResult_car table {
				width: 100%;
			}
			
			.weui-picker-modal,
			.weui-select-modal,
			.weui-picker-modal-visible {
				z-index: 100000 !important;
			}
		</style>
		<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=MMh4H9m5FLBpizlht86GnGynuaM0oGKz"></script>
	</head>

	<body ontouchstart>

		<div class="mask opacity" id="opacityDiv" style="display: none;">
			<div id="tcLoading" style="display: none;">
				努力加载中...
			</div>
		</div>
		<div class="cxgh_main" id="cxgh_all">
			<div class="cxgh_head">
				<div class="app_head_left">
					<a class="iconfont" id="returnBtn_cxgh">&#xe6d4;</a>
				</div>
				<div class="app_head_mid">
					<p id="app_head_title">沿途服务</p>
				</div>
				<div class="app_head_right">
					<a href="javascript:;" class="iconfont" id="getMyPosition">&#xe6c9;</a>
					<a href="javascript:;" id="returnCxgh" style="display: none;">返回</a>
				</div>
			</div>
			<div id="l-map" style="display: none;">
				
			</div>
			<!--出行规划驾车方式新增图层的选项-->
			<div id="map_setUp" style="display: none;">
				<a id="toMapBtn" onclick="searchOnMapBtn(this)">
					<img src="img/index/mapshow.png" style="width: 35px;" class="downIcon" />
					<b style="color: #0070B4;">地图查看</b>
				</a>
				<a href="javascript:;" class="tc_Btn" id="typeCar" style="display: none;">
					<b>查询详情</b>
					<img src="img/cxgh/up.png" class="downIcon" />
				</a>
				<a href="javascript:;" class="tc_Btn" id="routeCar" style="display: none;">
					<b>最短时间</b>
					<img src="img/cxgh/up.png" class="downIcon" />
				</a>
				<input type="hidden" id="sfzVal" value="" />
				<input type="hidden" id="fwqVal" value="" />
				<input type="hidden" id="tourVal" value="" />
			</div>
			<div class="placeInput">
				<div class="placeInput_left">
					<img src="img/cxgh/Icon_qiehuanfangxiang.png" id="exchangeBtn" />
				</div>
				<div class="placeInput_mid">
					<div id="myPosition_div" style="display: none;">我的位置</div>
					<div class="startPlace">
						<!--<a class="iconfont myPlaceSign">&#xe6c9;</a>-->
						<img src="img/cxgh/Icon_startbig.png" />
						<input type="text" id="suggestId_start" data-myPstr="" placeholder="输入起点" />
						<input type="hidden" id="hidden1" value="" />
					</div>
					<div class="endPlace">
						<img src="img/cxgh/Icon_endbig.png" />
						<input type="text" name="" id="suggestId_end" placeholder="输入终点" />
						<input type="hidden" id="hidden2" value="" />
					</div>

				</div>
				<div class="placeInput_right">
					<a class="iconfont" id="research_btn" href="javascript:;">&#xe709;</a>
				</div>
			</div>

			<div id="car">
				<div id="myResult_car">
					<div class="loadingImgResult" style="display: none;">
						<div class="loading">
							<span>畅</span>
							<span>行</span>
							<span>吉</span>
							<span>林</span>
						</div>
					</div>
					<div id="noResultCar" style="display: none;">暂无查询结果</div>
				</div>
			</div>

			<!--底部-->
			<footer>
				<li>
					<a href="index01.html">
						<div>
							<img src="img/index/index__normol.png" />
						</div>
						<p>首页</p>
					</a>
				</li>
				<li>
					<a href="cxgh.html">
						<div>
							<img src="img/index/chuxingguihuazhengchang.png" />
						</div>
						<p>出行规划</p>
					</a>
				</li>
				<li>
					<a href="my.html">
						<div>
							<img src="img/index/my__normol.png" />
						</div>
						<p>我的出行</p>
					</a>
				</li>
			</footer>
		</div>
		<!--<a class="souzhoubian" id="zbBtn" style="display: none;">
			<img src="img/cxgh/souzhoubian.png" /> 周边
		</a>-->
		<!--</div>-->

		<script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/md5.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/weui/jquery-weui.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/back_end.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" charset="UTF-8">
			//返回按钮
			$("#returnBtn_cxgh").click(function() {
				if(document.getElementById("l-map").style.display == "none") { //主页面上
					window.location.href = "javascript:history.go(-1)";
				} else { //查询结果页面上
					window.location.reload();
					//					$("#l-map").hide();
					//					$(".placeInput").show();
				}

			});

			// 百度地图API功能
			var map = new BMap.Map("l-map");
			var P = new BMap.Point(125.330855, 43.936976);
			map.centerAndZoom(P, 12);
			var ac_1 = new BMap.Autocomplete;
			var ac_2 = new BMap.Autocomplete;

			//起点框输入事件
			ac_1 = new BMap.Autocomplete( //建立一个自动完成的对象
				{
					"input": "suggestId_start",
					"location": "吉林省"
				});
			ac_1.addEventListener("onhighlight", function(e) { //鼠标放在下拉列表上的事件
				var str = "";
				var _value = e.fromitem.value;
				var value = "";
				if(e.fromitem.index > -1) {
					value = _value.province + _value.city + _value.district + _value.street + _value.business;
				}
				str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

				value = "";
				if(e.toitem.index > -1) {
					_value = e.toitem.value;
					value = _value.province + _value.city + _value.district + _value.street + _value.business;
				}
				str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
				//				$("#searchResultPanel").innerHTML = str;
			});

			ac_1.addEventListener("onconfirm", function(e) { //鼠标点击下拉列表后的事件
				var _value = e.item.value;
				$("#suggestId_start").blur();
				myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
				//				$("#searchResultPanel").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
			});

			function addMyPositionSign() {
				//方法：添加我的位置标记
				$(".startPlace a").remove();
				var sign = $('<a class="iconfont myPlaceSign" id="myPlaceSign">&#xe6c9;</a>');
				$("#suggestId_start").before(sign);
				$("#suggestId_start").val("");
				$("#suggestId_start").attr("placeholder", "     我的位置");
				$("#myPosition_div").show();
				$("#suggestId_end").click(); //出现“我的位置”后 立刻转移光标到终点框
				getGeocode();
			};

			function delMyPositionSign() {
				$(".myPlaceSign").remove();
				//				$("#suggestId_start").removeClass("myPlaceCol");
				$("#suggestId_start").attr("placeholder", "输入起点");
			};

			//得到当前位置json字符串信息 及经纬度坐标 海拔 移动 移动速度的方法
			function geoInf(position) {
				var addressStr = position.addresses;
				var codns = position.coords; //获取地理坐标信息；
				var lat = codns.latitude; //获取到当前位置的纬度；
				var x = lat;
				var longt = codns.longitude; //获取到当前位置的经度
				var y = longt;
				//								alert(addressStr);
				//				$("#jbPlace").val(addressStr);
				//				console.log('------定位-----' + addressStr);
				var myP = y + "," + x;
				$("#suggestId_start").attr("data-myPstr", myP);
			}

			// 通过定位模块获取位置信息
			function getGeocode() {
				plus.geolocation.getCurrentPosition(geoInf, {
					geocode: true
				});
			}

			//查询带有我的位置情况下的自驾路径规划
			function zjMyPosition(p1, zdAddress) {
				// 创建地址解析器实例
				var myGeo = new BMap.Geocoder();
				// 将地址解析结果显示在地图上,并调整地图视野
				//				console.log(zdAddress);
				myGeo.getPoint(zdAddress, function(point) {
					if(point) {
						map.centerAndZoom(point, 16);
						map.addOverlay(new BMap.Marker(point));
						//根据起终点坐标查询我的位置-我收藏的地点的线路规划
						var p2 = new BMap.Point(point.lng, point.lat);
						var driving = new BMap.DrivingRoute(map, {
							renderOptions: {
								map: map,
								panel: "myResult_car",
								autoViewport: true
							}
						});
						$("#hidden2").val(point.lng + "," + point.lat); //将终点坐标赋值到隐藏框
						driving.search(p1, p2);
						$(".loadingImgResult").hide();
						$("#map_setUp").show();
						$("footer").hide();
					} else {
						$.alert("您选择的地址没有解析到结果");
					}
				}, "吉林省");

			}
			//			//baidu获取我的位置方法---------------------
			//			function getMyPosition(zdAddress) {
			//				//获取我的位置
			//				var geolocation = new BMap.Geolocation();
			//				geolocation.getCurrentPosition(function(r) {
			//					if(this.getStatus() == BMAP_STATUS_SUCCESS) {
			//						var mk = new BMap.Marker(r.point);
			//						map.addOverlay(mk);
			//						map.panTo(r.point);
			//						//收藏地点地址解析
			//						// 创建地址解析器实例
			//						var myGeo = new BMap.Geocoder();
			//						// 将地址解析结果显示在地图上,并调整地图视野
			//						console.log(zdAddress);
			//						myGeo.getPoint(zdAddress, function(point) {
			//							if(point) {
			//								map.centerAndZoom(point, 16);
			//								map.addOverlay(new BMap.Marker(point));
			//								//console.log(point.lng + "，" + point.lat);
			//								//根据起终点坐标查询我的位置-我收藏的地点的线路规划
			//								var p1 = new BMap.Point(r.point.lng, r.point.lat);
			//								var p2 = new BMap.Point(point.lng, point.lat);
			//								var driving = new BMap.DrivingRoute(map, {
			//									renderOptions: {
			//										map: map,
			//										panel: "#myResult_car",
			//										autoViewport: true
			//									}
			//								});
			//								driving.search(p1, p2);
			//
			//								//$("#tangram-suggestion--TANGRAM__1z-main").hide();
			//							} else {
			//								$.alert("您选择的地址没有解析到结果");
			//							}
			//						}, "吉林省");
			//
			//					} else {
			//						//alert('failed' + this.getStatus());
			//					}
			//				}, {
			//					enableHighAccuracy: true
			//				})
			//			};
			//------------页面加载时就执行----------
			$(function() {
				var h = document.documentElement.clientHeight;
				$("#l-map").height(h - 70 - 50);
			});

			function clickSearchBtn() {
				$("#research_btn").click();
			}

			$("#map_setUp").click(function() {
				//				$(this).hide();
				$("#map_setUp").slideToggle("fast");
			});

			$("#typeCar").select({
				title: "请选择您要查询的内容",
				items: [{
						title: "沿途收费站",
						value: "0"
					},
					{
						title: "沿途服务区",
						value: "1"
					},
					{
						title: "附近景点",
						value: "2"
					}
				],
				onOpen: function() {
					//弹窗打开时 显示遮罩层
					$("#opacityDiv").show();
				},
				onClose: function() {
					//弹窗关闭时 隐藏遮罩层
					$("#opacityDiv").hide();
					$("#map_setUp").show();
				},
				onChange: function(d) {
					$("#map_setUp").show();
					$("#typeCar b").html(d.titles);
					var k = d.values;
					map.clearOverlays();
					var Route = $("#routeCar b").html();
					var start;
					var end;
					if($("#suggestId_start").attr("placeholder").indexOf("我的位置") == -1) {
						start = $("#suggestId_start").val();
						end = $("#suggestId_end").val();
					} else {
						var a = $("#hidden1").val();
						var b = $("#hidden2").val();
						var a1 = Number(a.split(",")[0]);
						var a2 = Number(a.split(",")[1]);
						var b1 = Number(b.split(",")[0]);
						var b2 = Number(b.split(",")[1]);
						start = new BMap.Point(a1, a2);
						end = new BMap.Point(b1, b2);
					}

					if(Route == "最短时间") {
						var driving = new BMap.DrivingRoute(map, {
							renderOptions: {
								map: map,
								//								autoViewport: true,
								panel: "myResult_car"
							},
							policy: routePolicy_driving[0]
						});
					} else if(Route == "最短距离") {
						var driving = new BMap.DrivingRoute(map, {
							renderOptions: {
								map: map,
								//								autoViewport: true,
								panel: "myResult_car"
							},
							policy: routePolicy_driving[1]
						});
					} else if(Route == "避开高速") {
						var driving = new BMap.DrivingRoute(map, {
							renderOptions: {
								map: map,
								//								autoViewport: true,
								panel: "myResult_car"
							},
							policy: routePolicy_driving[2]
						});
					}
					driving.search(start, end);
					pushMsgToMap(k);
				}
			});

			//在地图图层上添加该线路途经的收费站等的点和信息 方法
			function pushMsgToMap(k) {
				if(k == 0) {
					//					alert(11);
					//选中查询沿途收费站
					var sfz = eval($("#sfzVal").val());
					//					console.log(sfz);
					for(var i = 0; i < sfz.length; i++) {
						var sfzX = sfz[i].coordinateX; //纬度
						var sfzY = sfz[i].coordinateY; //精度
						var sfzName = sfz[i].stationName; //名称
						sfz[i].openStatus = sfz[i].openStatus == 0 ? "关闭" : "正常运行"; //服务状态
						sfz[i].position = sfz[i].position ? sfz[i].position : "暂无数据"; //线路
						sfz[i].destination = sfz[i].destination ? sfz[i].destination : "暂无数据"; //通往
						var sfzPoint = new BMap.Point(sfzX, sfzY);
						//创建图标
						var sfzIcon = new BMap.Icon("img/cxgh/shoufeizhan.png", new BMap.Size(24, 24));
						var marker1 = new BMap.Marker(sfzPoint, {
							icon: sfzIcon
						}); // 创建标注
						map.addOverlay(marker1);
						var content = "<p>名称：  " + sfz[i].stationName + "</p>" +
							"<p>服务状态：  " + sfz[i].openStatus + "</p>" +
							"<p>线路：  " + sfz[i].position + "</p>" +
							"<p>通往：  " + sfz[i].destination + "" + sfz[i].travel + "</p>";
						var title1 = "收费站信息";
						addClickHandler(content, marker1, title1);
					}
				};
				if(k == 1) {
					//					alert(22);
					//选中查询沿途服务区
					var fwq = eval($("#fwqVal").val());
					console.log(fwq);
					for(var i = 0; i < fwq.length; i++) {
						var fwqX = fwq[i].coordinateX; //纬度
						var fwqY = fwq[i].coordinateY; //精度
						var fwqName = fwq[i].serviceName; //名称
						var openStatus = fwq[i].openStatus == 0 ? "关闭" : "正常运行"; //服务状态
						var position = fwq[i].position ? fwq[i].position : "暂无数据"; //线路
						var business = fwq[i].business == "" ? "暂无数据" : fwq[i].business; //通往
						var fwqPoint = new BMap.Point(fwqX, fwqY);
						//创建图标
						var fwqIcon = new BMap.Icon("img/cxgh/fuwuqu.png", new BMap.Size(24, 24));
						var marker2 = new BMap.Marker(fwqPoint, {
							icon: fwqIcon
						}); // 创建标注
						map.addOverlay(marker2);
						var content = "<p>名称:  " + fwqName + "</p>" +
							"<p>服务状态:  " + openStatus + "</p>" +
							"<p>线路:  " + position + "</p>" +
							"<p>业务:  " + business + "</p>";
						var title2 = "服务区信息";
						addClickHandler(content, marker2, title2);
					}
				};
				if(k == 2) {
					//					alert(33);
					//选中查询附近景点
					var tour = eval($("#tourVal").val());
					console.log(tour);
					for(var i = 0; i < tour.length; i++) {
						var zb = tour[i].ZB;
						zb = zb.split(",");
						var a = zb.slice(0, 1);
						var b = zb.slice(1, 2);
						var dz = tour[i].DZ;
						var jqmc = tour[i].JQMC;
						var tourPoint = new BMap.Point(a, b);
						//创建图标
						var tourIcon = new BMap.Icon("img/cxgh/lvyou.png", new BMap.Size(24, 24));
						var marker3 = new BMap.Marker(tourPoint, {
							icon: tourIcon
						}); // 创建标注
						map.addOverlay(marker3);
						var content = "<br/><p>景区名称:  " + jqmc + "</p><br/>" +
							"<p>地址:  " + dz + "</p>";
						var title3 = "景点信息";
						addClickHandler(content, marker3, title3);
					}
				};
			};
			//点击图标显示详情
			function addClickHandler(content, marker, title) {
				var opts = {
					width: 120, // 信息窗口宽度
					title: title, // 信息窗口标题
				}
				marker.addEventListener("onclick", function(e) {
					var p = e.target;
					var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
					var infoWindow = new BMap.InfoWindow(content, opts); // 创建信息窗口对象
					map.openInfoWindow(infoWindow, point); //开启信息窗口

				});
			};

			$("#suggestId_start").keyup(function() {
				//				$(this).attr("placeholder", "输入起点");
				//				if(this.value == "我的位置") {
				if($(this).val() == "我的位置") {
					addMyPositionSign();
					$(this).blur();
				} else {
					delMyPositionSign();
				}
				//					console.log($("table").html());
				//					$("table").parent().hide();
				//				var sign = $('<a class="iconfont myPlaceSign">&#xe6c9;</a>');
				//				$(this).before(sign);
				//				$(this).addClass("myPlaceCol");
				//				} else {
				//				$(this).removeClass("myPlaceCol");
				//				$(".myPlaceSign").remove();
				//				}
			}).click(function() {
				this.focus();
				this.select();
			});

			$("#abc").click(function() {
				console.log(myPosition());
			});
			$("#exchangeBtn").click(function() {
				//				console.log($(".startPlace").children().length);
				if($(".startPlace").children().length == "3") {
					var startVal = $("#suggestId_start").val();
					var endVal = $("#suggestId_end").val();
					//起点input框内不含“我的位置”时
					$("#suggestId_end").val(startVal);
					$("#suggestId_start").val(endVal);
					//					yzCollect();
				} else {
					//当起点为我的位置时 不可替换
				}

			});

			//点击跳转至地图查看图层的按钮
			function searchOnMapBtn(t) {
				$(t).slideToggle("fast"); //隐藏这个按钮
				$("#car").hide();
				$(".placeInput").hide();
				$("#l-map").show(); //跳转至地图页
				$("#getMyPosition").hide(); //右上角隐藏定位按钮
				$("#returnCxgh").show(); //右上角显示返回按钮
				if($("#suggestId_start").attr("placeholder").indexOf("我的位置") == -1) {
					getView();
				} else {
					var p1 = $("#hidden1").val();
					var p2 = $("#hidden2").val();
					whenMyP_getView(p1, p2);
					map.setZoom(8);
				}
				$("#typeCar").show();
				$("#routeCar").show();
				$("#map_setUp").slideToggle("fast"); //显示图层的两个按钮
				getLineByCarCover(); //获取图层信息
			}

			//★★★★★★★★★★★★★★★★★★★★★★
			//★★★★★点击查询按钮搜索路线★★★★★
			//★★★★★★★★★★★★★★★★★★★★★★
			$("#research_btn").click(function() {
				$(".loadingImgResult").show();
				if($("#suggestId_start").val() == "" && $("#suggestId_start").attr("placeholder") == "输入起点" || $("#suggestId_end").val() == "") {
					$.alert("请您输入起点和终点", "提示");
				} else if($("#suggestId_start").val() == "" && $("#suggestId_start").attr("placeholder").indexOf("我的位置") > -1 && $("#suggestId_end").val() != "") {
					//查询我的位置情况下的自驾出行规划
					var aStr = $("#suggestId_start").attr("data-myPstr"); //起点的坐标点
					aX = aStr.split(",")[0];
					aY = aStr.split(",")[1];
					//					console.log(aX);
					//					console.log(aY);
					var a = new BMap.Point(aX, aY);
					$("#hidden1").val(aStr); //将终点坐标赋值到隐藏框
					var b = $("#suggestId_end").val(); //终点框里的字符串
					zjMyPosition(a, b); //调用查询方法
				} else {
					driving();
				}

			});

			//			function baiduGetPath() {
			//				var pathStr = "";
			//				//				var pathArr = [];
			//				$.ajax({
			//					type: "post",
			//					url: "https://api.map.baidu.com/direction/v1",
			//					data: {
			//						"mode": "driving",
			//						"origin": $("#suggestId_start").val(),
			//						"destination": $("#suggestId_end").val(),
			//						"origin_region": "吉林",
			//						"destination_region": "吉林",
			//						"output": "json",
			//						"ak": "MMh4H9m5FLBpizlht86GnGynuaM0oGKz"
			//					},
			//					async: false,
			//					cache: false,
			//					dataType: "jsonp", //数据类型为jsonp
			//					success: function(data) {
			//						console.log(data.type);
			//						if(data.type == 1) {
			//							//当搜索无结果时
			//							$("#noResultCar").show();
			//						} else if(data.type == 2) {
			//							//当搜索有结果时
			//							$("#noResultCar").hide();
			//
			//						}
			//					},
			//					error: function(data) {
			//						$.alert("连接超时，请稍后再试", "提示");
			//					}
			//				});
			//			}

			//点击返回按钮
			$("#returnCxgh").click(function() {
				$("#l-map").hide(); //隐藏地图
				$(".placeInput").show();
				$("#toMapBtn").show();
				$("#car").show();
				$(this).hide(); //显示返回按钮
				$("#getMyPosition").show(); //右上角显示回定位按钮
				$("#typeCar").hide(); //地图底部选项卡
				$("#routeCar").hide(); //地图底部选项卡
			});

			//			function getLayerCover() {
			//				//				console.log(pathStr);
			//				var blob = new Blob(pathArr, {
			//					type: "text/xml"
			//				});
			//				var formData = new FormData();
			//				FormData().append("LINEPATH", blob);
			//				$.ajax({
			//					type: "post",
			//					url: Url,
			//					data: {
			//						"type": "trip_planning_layer_cover",
			//						"LINEPATH": pathStr, //出行规划查询到的所有路段的path坐标点的字符串集合
			//						"TOLLSTATION": true, //是否查询线路周边收费站信息
			//						"SERVICE": true, //是否查询线路周边服务区信息
			//						"TOURISTSPOT": true //是否查询线路周边旅游景点信息
			//					},
			//					async: false,
			//					cache: false,
			//					dataType: "jsonp", //数据类型为jsonp
			//					jsonp: "callbackparam", //服务端用于接收callback调用的function名的参数  
			//					jsonpCallback: "jsonpCallback1",
			//					success: function(data) {
			//						console.log(data);
			//					},
			//					error: function(data) {
			//						$.alert("连接超时，请稍后再试", "提示");
			//					}
			//				});
			//			}
			//			// 百度地图API功能
			//			var routePolicy_transit = [BMAP_TRANSIT_POLICY_LEAST_TIME, BMAP_TRANSIT_POLICY_LEAST_TRANSFER, BMAP_TRANSIT_POLICY_AVOID_SUBWAYS];
			//
			var routePolicy_driving = [BMAP_DRIVING_POLICY_LEAST_TIME, BMAP_DRIVING_POLICY_LEAST_DISTANCE, BMAP_DRIVING_POLICY_AVOID_HIGHWAYS];
			//驾车规划
			function driving(d) {
				map.clearOverlays();
				var d = d ? d : 0;
				var start;
				var end;
				if($("#suggestId_start").attr("placeholder").indexOf("我的位置") == -1) {
					start = $("#suggestId_start").val();
					end = $("#suggestId_end").val();
				} else {
					var a = $("#hidden1").val();
					var b = $("#hidden2").val();
					var a1 = Number(a.split(",")[0]);
					var a2 = Number(a.split(",")[1]);
					var b1 = Number(b.split(",")[0]);
					var b2 = Number(b.split(",")[1]);
					start = new BMap.Point(a1, a2);
					end = new BMap.Point(b1, b2);
				}
				var route = routePolicy_driving[d.values];
				var driving = new BMap.DrivingRoute(map, {
					renderOptions: {
						map: map,
						autoViewport: true,
						panel: "myResult_car"
					},
					policy: route
				});
				driving.search(start, end);
				$("#map_setUp").show();
				$("footer").hide();
			};

			//自驾出行图层叠加 方法
			//			type = trip_planning_layer_cover
			//			TACTICS = 出行方案-- -- - 10 不高速 11 常规 12 距离短 13 不拥堵
			//			ORIGIN = 出发地
			//			DESTINATION = 目的地
			var tactics = 11;

			function getLineByCarCover() {
				$("#tcLoading").show();
				$("#opacityDiv").show();
				var typeCar = $("#routeCar b").html();
				if(typeCar == "最短时间") {
					tactics = 11;
				} else if(typeCar == "最短距离") {
					tactics = 12;
				} else if(typeCar == "避开高速") {
					tactics = 10;
				};
				if($("#suggestId_start").attr("placeholder").indexOf("我的位置") == -1) { //用户输入了起终点
					var x = $("#suggestId_start").val();
					var y = $("#suggestId_end").val();
					tcAjax(x, y);
				} else { //用户使用了我的位置为起点
					var p1 = $("#hidden1").val();
					var p2 = $("#hidden2").val();
					var p1X = p1.split(",")[1];
					var p1Y = p1.split(",")[0];
					var p2X = p2.split(",")[1];
					var p2Y = p2.split(",")[0];
					var a = p1X + "," + p1Y;
					var b = p2X + "," + p2Y;
					//					console.log(a);
					//					console.log(b);
					tcAjax(a, b);
				}
			};

			function tcAjax(x, y) {
				//				console.log(tactics);
				//				console.log(x);
				//				console.log(y);
				$.ajax({
					type: "post",
					url: Url,
					data: {
						"type": "trip_planning_layer_cover",
						"TACTICS": tactics,
						"ORIGIN": x,
						"DESTINATION": y
					},
					async: false,
					cache: false,
					dataType: "jsonp", //数据类型为jsonp
					jsonp: "callbackparam", //服务端用于接收callback调用的function名的参数  
					jsonpCallback: "jsonpCallback1",
					success: function(data) {
						//						console.log(data);
						$("#opacityDiv").hide();
						$("#tcLoading").hide();
						var m1 = data.LDATA;
						var d1 = data.LVYOU;
						var m2 = data.SDATA;
						var d2 = data.SHOUFEIZHAN;
						var m3 = data.FDATA;
						var d3 = data.FUWUQU;

						if(isEncrypt(d1, m1) && isEncrypt(d2, m2) && isEncrypt(d3, m3)) {
							var fwqStr = data.FUWUQU;
							$("#fwqVal").val(fwqStr);
							var sfzStr = data.SHOUFEIZHAN;
							$("#sfzVal").val(sfzStr);
							var tourStr = data.LVYOU;
							$("#tourVal").val(tourStr);
							$("#map_setUp").slideDown("fast");
							$("#opacityDiv").hide();
							$("#tcLoading").hide();
							console.log(tourStr);
						} else {
							errMD();
						}

					},
					error: function(data) {
						$.alert("连接超时，请检查您的网络设置", "提示");
					}
				});
			}

			//选择类型 自驾
			$("#routeCar").select({
				title: "选择自驾查询方案",
				//				autoClose: true,
				items: [{
						title: "最短时间",
						value: 0 //BMAP_DRIVING_POLICY_LEAST_TIME,
					},
					{
						title: "最短距离",
						value: 1 //BMAP_DRIVING_POLICY_LEAST_DISTANCE,
					},
					{
						title: "避开高速",
						value: 2 //BMAP_DRIVING_POLICY_AVOID_HIGHWAYS",
					}
				],
				onOpen: function() {
					//弹窗打开时 显示遮罩层
					//					$("#opacityDiv").show();
				},
				onClose: function() {
					//弹窗关闭时 隐藏遮罩层
					$("#map_setUp").show();
				},
				onChange: function(d) {
					$("#opacityDiv").show();
					$("#tcLoading").show();
					$("#map_setUp").hide();
					$("#routeCar b").html(d.titles);
					map.clearOverlays();
					driving(d);
					getLineByCarCover();
					$("#typeCar b").html("查询详情"); //清空查询内容选项卡
					//					$("#typeCar").select(); //初始化查询内容选项卡
					//					if($("#typeCar b").html() == "沿途收费站") {
					//						pushMsgToMap(0);
					//					} else if($("#typeCar b").html() == "沿途服务区") {
					//						pushMsgToMap(1);
					//					} else if($("#typeCar b").html() == "附近景点") {
					//						pushMsgToMap(2);
					//					}

				}
			});

			var myValue;
			//输入提示
			$("#suggestId_start").focus(function() {
				//隐藏我的位置div
				$("#myPosition_div").hide();

			});

			$("#suggestId_end").one("focus", function() {
				ac_2 = new BMap.Autocomplete( //建立一个自动完成的对象
					{
						"input": "suggestId_end",
						"location": "吉林省"
					});
				ac_2.addEventListener("onhighlight", function(e) { //鼠标放在下拉列表上的事件
					var str = "";
					var _value = e.fromitem.value;
					var value = "";
					if(e.fromitem.index > -1) {
						value = _value.province + _value.city + _value.district + _value.street + _value.business;
					}
					str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

					value = "";
					if(e.toitem.index > -1) {
						_value = e.toitem.value;
						value = _value.province + _value.city + _value.district + _value.street + _value.business;
					}
					str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
					//				$("#searchResultPanel").innerHTML = str;
				});

				ac_2.addEventListener("onconfirm", function(e) { //鼠标点击下拉列表后的事件
					var _value = e.item.value;
					$("#suggestId_end").blur();
					myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
					//				alert(myValue);
					//					if(localStorage.userJson) {
					//						$("#suggestId_end_hidden").val(myValue);
					//						$("#taoxin").css("color", "#FF0000");
					//						//显示可收藏字样
					//						$("#taoxin").next().html("可收藏");
					//						$("#taoxin").next().show();
					//						//					clearTimeout(timeout);
					//					}
					//					}
					//				console.log($("#suggestId_end_hidden").val());
					//				$("#searchResultPanel").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
				});

			});

			//点击起点输入框时 消除我的位置标记
			$("#suggestId_start").click(function() {
				delMyPositionSign();

			});

			$("#suggestId_end").blur(function() {
				$("table").parent().hide();
			}).keyup(function() {
				$("table").parent().show();
			}).click(function() {
				this.focus();
				this.select();
			});
			//			$("#tangram-suggestion--TANGRAM__1f table").click(function(){
			//				$(this).hide();
			//			});
			$("#getMyPosition").click(function() {
				if($(".startPlace").children().length == "3") {
					//当起点输入框不为我的位置时添加方法 
					//控制添加<a>标签我的位置的数量 只能添加一次
					addMyPositionSign();
				}

			});

			$("#myPosition_div").click(function() {
				//当点击到我的位置时 隐藏该div
				$(this).hide();
				$("#suggestId_start").attr("placeholder", "输入起点");
				$("#myPlaceSign").remove();
				$("#suggestId_start").focus();
			});

			//			//点击自驾中的搜周边按钮 方法
			//			$("#zbBtn").click(function() {
			//				$("#cxghIframe").hide();
			//				$("#l-map").show();
			//				$(this).hide();
			//				$("footer").hide(); //隐藏底部
			//				$("#returnCxgh").show(); //显示右上角返回按钮
			//				getView();
			//				//线路适应屏幕大小
			//				getLineByCarCover();
			//			});

			function getView() {
				//地址解析
				var myGeo = new BMap.Geocoder();
				var newPathArray = [];
				var start = $("#suggestId_start").val();
				var end = $("#suggestId_end").val();
				var p1;
				var p2;
				// 将起点地址解析结果显示在地图上
				myGeo.getPoint(start, function(point) {
					if(point) {
						//根据起终点坐标查询我的位置-我收藏的地点的线路规划
						p1_1 = Number(point.lng);
						p1_2 = Number(point.lat);
						p1 = new BMap.Point(p1_1, p1_2);
						//						console.log(p1);
						myGeo.getPoint(end, function(point) {
							if(point) {
								//根据起终点坐标查询我的位置-我收藏的地点的线路规划
								p2_1 = Number(point.lng);
								p2_2 = Number(point.lat);
								p2 = new BMap.Point(p2_1, p2_2);
								//								console.log(p2);
								newPathArray.push(p1, p2);
								//								console.log(newPathArray);
								map.setViewport(newPathArray);
							} else {
								$.alert("您选择的地址没有解析到结果!", "提示");
							}
						});
					} else {
						$.alert("您选择的地址没有解析到结果!", "提示");
					}
				});
			}

			//我的位置情况下调整地图视角方法
			function whenMyP_getView(a, b) {
				var newPathArray = []; //定义空数组
				var a1 = Number(a.split(",")[0]);
				var a2 = Number(a.split(",")[1]);
				var b1 = Number(b.split(",")[0]);
				var b2 = Number(b.split(",")[1]);
				var start = new BMap.Point(a1, a2);
				var end = new BMap.Point(b1, b2);
				newPathArray.push(start, end);
				map.setViewport(newPathArray); //将两个点调整到合适的地图视角
			}
		</script>
	</body>

</html>